<template>
	<view class="w-full">

		<uni-data-picker v-model="citys" ref="picker" :localdata="items" popup-title="请选择"
			v-slot:default="{data, error, options}" @nodeclick="onnodeclick" :map="{text:'name',value:'id'}">

			<view v-if="error" class="error">
				<text>{{error}}</text>
			</view>

			<view v-else-if="data.length" class="u-flex">
				<view v-for="(item,index) in data" :key="index">
					<text>{{item.text}}</text>
				</view>
			</view>
			<view v-else>
				<text class="text_2">请选择您的房屋位置</text>
			</view>
		</uni-data-picker>
	</view>
</template>

<script>
	import region from "@/static/js/region.js"

	export default {
		name: "shop-region",
		data() {
			return {
				items: region.data,
			};
		},
		computed: {
			citys: {
				get() {
					return String(this.area);
				},
				set(v) {
					if (v) {
						this.$emit('change', v);
					}

				}
			}
		},
		props: ['value', 'area'],
		model: {
			prop: 'value',
			event: 'change'
		},
		// mounted() {

		// 	this.area=String(this.area);
		// 	console.log(this.area);

		// },
		// created() {
		// 	this.$nextTick(()=>{
		// 		 this.deafultValue=this.area;
		// 	})

		// },
		methods: {

			onnodeclick(e) {

			}
		}
	}
</script>

<style lang="scss">
	.text_2 {
		color: #c0c4cc;
	}
</style>
